import 'package:flutter/material.dart';
import 'package:wechat/const.dart';
import 'package:wechat/discovery/discovery_child_page.dart';
import 'package:wechat/friend/index_bar.dart';
import 'friend_data.dart';

class _friendCell extends StatelessWidget {
  const _friendCell({
    super.key,
    required this.name,
    this.imageUrl,
    this.imageAssets,
    this.groupTitle,
  });

  final String name;
  final String? imageUrl;
  final String? imageAssets;
  final String? groupTitle;

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.white,
      child: Column(
        children: [
          Container(
            alignment: Alignment.centerLeft,
            width: screenWidth(context),
            height: groupTitle != null ? 30 : 0,
            padding: const EdgeInsets.only(left: 10),
            color: wechatThemeColor,
            child: groupTitle != null
                ? Text(
                    groupTitle!,
                    style: const TextStyle(fontSize: 12, color: Colors.grey),
                  )
                : null,
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 36,
                height: 36,
                margin: const EdgeInsets.only(left: 10),
                decoration: BoxDecoration(
                  color: wechatThemeColor,
                  borderRadius: const BorderRadius.all(Radius.circular(5)),
                  image: imageUrl != null
                      ? DecorationImage(image: NetworkImage(imageUrl!))
                      : DecorationImage(image: AssetImage(imageAssets!)),
                ),
              ),
              SizedBox(
                  width: screenWidth(context) - 56,
                  child: Column(
                    children: [
                      Container(
                        height: 56,
                        alignment: Alignment.centerLeft,
                        child: Text(
                          name,
                          style: const TextStyle(
                            color: Colors.black,
                            fontSize: 16,
                            fontWeight: FontWeight.w400,
                          ),
                        ),
                      ),
                      Container(
                        height: 0.5,
                        color: wechatThemeColor,
                      ),
                    ],
                  )),
            ],
          ),
        ],
      ),
    );
  }
}

class FriendPage extends StatefulWidget {
  const FriendPage({super.key});

  @override
  State<FriendPage> createState() => _FriendPageState();
}

class _FriendPageState extends State<FriendPage> {
  final List<Friend> _otherData = [
    Friend(name: '新的朋友', imageAssets: 'images/new_friend.png'),
    Friend(name: '群聊', imageAssets: 'images/group_chat.png'),
    Friend(name: '标签', imageAssets: 'images/label.png'),
    Friend(name: '公众号', imageAssets: 'images/official_account.png'),
  ];

  final List<Friend> _listData = [];

  @override
  void initState() {
    super.initState();
    _listData
      ..addAll(datas)
      ..addAll(datas);
    _listData.sort((Friend a, Friend b) {
      return a.groupTitle!.compareTo(b.groupTitle!);
    });
  }

  Widget _itemForRow(BuildContext context, int index) {
    if (index < _otherData.length) {
      return _friendCell(
        name: _otherData[index].name!,
        imageAssets: _otherData[index].imageAssets!,
      );
    }

    bool hiddenGroupTitle = (index > _otherData.length &&
        _listData[index - _otherData.length].groupTitle ==
            _listData[index - (_otherData.length + 1)].groupTitle);

    return _friendCell(
      name: _listData[index - _otherData.length].name!,
      imageUrl: _listData[index - _otherData.length].imageUrl!,
      groupTitle: hiddenGroupTitle
          ? null
          : _listData[index - _otherData.length].groupTitle!,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('通讯录'),
        actions: <Widget>[
          GestureDetector(
            child: Container(
              margin: const EdgeInsets.only(right: 15),
              child: Image.asset('images/add.png', width: 24, height: 24),
            ),
            onTap: () {
              Navigator.of(context).push(
                MaterialPageRoute(
                  builder: (BuildContext context) =>
                      const DiscoveryChildPage(title: '添加朋友'),
                ),
              );
            },
          )
        ],
        centerTitle: true,
        elevation: 0,
        backgroundColor: wechatThemeColor,
      ),
      body: Stack(
        children: [
          Container(
            color: wechatThemeColor,
            child: ListView.builder(
                itemCount: _listData.length + _otherData.length,
                itemBuilder: _itemForRow),
          ),
          const IndexBar(),
        ],
      ),
    );
  }
}
